<?xml version="1.0" encoding="UTF-8"?>
<!--
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
-->
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:p="http://primefaces.org/ui"
      xmlns:f="http://xmlns.jcp.org/jsf/core"
      xmlns:c="http://xmlns.jcp.org/jsp/jstl/core">
    <h:head>
        <title>Home</title>
    </h:head>
    <h:body>
        <f:facet name="last">
            <h:outputStylesheet name="css/wcalstyle.css" />
        </f:facet>
        <h:form styleClass="formCalendar">
            <p:growl id="messages" showDetail="true" />

            <p:dialog widgetVar="eventDialog" header="Event Details" showEffect="clip" hideEffect="clip">
                <h:panelGrid id="event" columns="1">
                    <h:outputLabel value="Id: #{calendarBean.event.id}" />
                    <h:outputLabel value="Title: #{calendarBean.event.description}" />
                    <h:outputLabel value="From: #{calendarBean.event.startDate}" /> 
                    <h:outputLabel value="To: #{calendarBean.event.endDate}" />
                    <p:commandButton id="editButton" value="Edit" actionListener="#{calendarBean.editEvent}" oncomplete="PF('myschedule').update();PF('eventDialog').hide();" />
                </h:panelGrid>
            </p:dialog>

            <h:panelGrid columnClasses="value">
                <h3 style="margin-top: 0">Calendar</h3>
                <p:schedule id="schedule" value="#{calendarBean.eventModel}" widgetVar="myschedule" timeZone="GMT+2">

                    <p:ajax event="eventSelect" listener="#{calendarBean.onEventSelect}" update="event" oncomplete="PF('eventDialog').show();"/>
                    

                </p:schedule>
                <h:button value="New event" outcome="/user/editevent" />
            </h:panelGrid>
        </h:form>

    </h:body>
</html>
